@extends('layouts.homebase')
@section('tdk')
<title>{{$tdk['title']}}</title>
<meta name="keywords" content="{{$tdk['keywords']}}" />
<meta name="description" content="{{$tdk['description']}}" />
@endsection
@section('css')
@parent
<link rel="stylesheet" type="text/css" href="">
@endsection
@section('content')

<main>
  <div class="lbox">
    <div class="weizhi">您现在的位置是：<a href="{{request()->schemeAndHttpHost()}}" class="classlinkclass">首页</a> > 
	<a href="/{{$cats[$art['cat_id']]['pinyin']}}/" class="classlinkclass">{{$cats[$art['cat_id']]['catname']}}</a>  >  {{$art['title']}}
	</div>
	
	<article>
      <h1>{{$art['title']}}</h1>
      <div class="wz_info">
	  <span>分类：<a href="/{{$cats[$art['cat_id']]['pinyin']}}/">{{$cats[$art['cat_id']]['catname']}}</a></span>
	  <span>作者：{{$art['author']}}</span><span>时间：{{substr($art['created_at'],0,10)}}</span><span>阅读数：{{$art['view']}}人阅读</span></div>
      <div class="content">
        <p>{!! $art['content'] !!}</p>      
	  </div>
      <div class="tags"> 相关标签：@foreach(art_tagstoids($art['art_id']) as $k=>$v) <a href="/tag/{{$k}}.html" title="{{$v}}" target="_blank">{{$v}}</a> @endforeach </div>     
	  <div class="next_pre">
		  <p>上一篇：<a href="/detail/{{$up['art_id']}}.html">{{$up['title']}}</a></p>
		  <p>下一篇：@if($down)<a href="/detail/{{$down['art_id']}}.html">{{$down['title']}}</a> @else 没有了 @endif</p>
	  </div>
      <div class="wz_zhuanzai">
        <p>本站所有文章、数据、图片均来自互联网,一切版权均归源网站或源作者所有。</p>
        <p>如果侵犯了你的权益请来信告知我们删除。邮箱：<a href="http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&amp;email=514224527@qq.com" target="_blank">514224527@qq.com</a></p>
      </div>  
	 <!--<div class="read_writer">
	  <h2><a href='80'>xx</a> 已更新 <a href="/" target="_blank">57</a> 篇文章</h2>
	  <ul><li><span>分类</span><a href="/" title="子分类" target="_blank">子分类</a></li></ul>
	 </div>-->

    <div class="wz_tuijian">
	 <p>推荐阅读</p>
	 <ul>
	 @foreach($relatedarts as $v)
		<li><a href="/detail/{{$v['art_id']}}.html" title="{{$v['title']}}" target="_blank"><h2>{{ mb_substr($v['title'],0,22,'utf-8') }}...</h2></a></li>
	 @endforeach	
	 </ul>
    </div>
	<!-- 评论 开始 -->
    <div>
	<p style="padding:10px;border:1px solid #d2d6dc;"><strong>请勿发布不友善或者负能量的内容。与人为善，比聪明更重要！</strong>
		<form method="post" action="comment" role="form">
			<div class="form-group">
				@csrf
				<input type="hidden" name="art_id" value="{{$art['art_id']}}">
				<div id="div-demo"></div>
				<textarea name="comment" id="text1" style="display: none"></textarea>
			</div>
			<button type="submit" style="padding: .78571429em 1.5em;border: none;background: #16499d;color: #fff;">评论</button>
			<font>欢迎 <span style="font-weight:bold;">{{Auth::user()->name??'登录'}}</span> 评论 ^_^</font>
		</form>
	</p>
	<div style="height:1rem;"></div><div class="pl-header"><em id="pl-totalnum">{{count($comments)}}</em>条评论</div>
	@foreach($comments as $one)
	<div style="padding:10px;border:1px solid #d2d6dc;margin-top:10px;">
		<a style="float:left"><img src="/home/img/facees/0{{substr($one['user_id'], -1)}}.jpg" class="media-object" width="30"></a>
		<div style="width:10000px;display: table-cell;vertical-align: top;">
			<h4 style="padding-left:5px;font-size:14px;">{{$one['username']}} <small style="color: #aaa;font-weight: 500;">{{$one['created_at']}}</small></h4>
			<p style="padding: 5px 20px">{!! $one['comment'] !!}</p>
			<form method="post" action="comment">
				@csrf
				<input type="hidden" name="fcomment_id" value="{{$one['comment_id']}}">
				<input type="hidden" name="art_id" value="{{$art['art_id']}}">
				<input class="repcomment{{$one['comment_id']}}" type="text" name="comment" placeholder="请输入..." style="width: 80%;padding: 10px;border: 1px solid #d2d6dc;outline: none;">
				<button type="submit" style="padding: .78571429em 1.5em;border: none;background: #16499d;color: #fff;">评论</button>
			</form>
			@if(isset($one['sub']))
			@foreach($one['sub'] as $two)
			<div style="margin-top:10px;">
				<a style="float:left"><img src="/home/img/facees/0{{substr($two['user_id'], -1)}}.jpg" class="media-object" width="30"></a>
				<div style="width:10000px;display: table-cell;vertical-align: top;">
					<h4 style="padding-left:5px;font-size:14px;">{{$two['username']}} <small style="color: #aaa;font-weight: 500;">{{$two['created_at']}}</small></h4>
					<p style="padding: 5px 20px">{!! $two['comment'] !!}</p>
					<a href="javascript:;" title="为此评论点赞" style="color:#ada5a5;font-size: 16px;" onclick="if (!window.__cfRLUnblockHandlers) return false; dianzan(this,2,'')">
						<i style="font-size:14px;">赞</i>
						<span class="rezan">{{$two['zan']}}</span>
					</a>
					<a href="javascript:;" title="回复 {{$two['username']}}" style="color:#ada5a5;font-size: 16px;" onclick="$('.repcomment{{$one['comment_id']}}').val('@'+'{{$two['username']}}# ');$('.repcomment{{$one['comment_id']}}').focus();">
						<i style="font-size:14px;">回复</i>
					</a>
				</div>
			</div>
			@endforeach
			@endif
			<div style="height:1rem;"></div>
			<a href="javascript:;" title="为此评论点赞" style="color:#ada5a5;font-size: 16px;" onclick="if (!window.__cfRLUnblockHandlers) return false; dianzan(this,1,'')">
				<i style="font-size:14px;">赞</i>
				<span class="rezan">{{$one['zan']}}</span>
			</a>
		</div>
	</div>
    @endforeach
  </div>
  <!-- 评论 结束 -->
  </article>
  </div>
  <aside class="rbox">
    <div class="ad">
		<a href="/" target="_blank">
		<img src="" alt="广告位">
		</a>
	</div>
    <div class="hot_news_pic">
      <p class="h_title">文章热榜</p>
      <ul>
	  	@foreach($hotarts as $art)
		<li><a href="/detail/{{$art['art_id']}}.html" title="{{$art['title']}}" target="_blank">{{$art['title']}}</a></li>
		@endforeach	
      </ul>
    </div>
  </aside>
</main>

@endsection
@section('js')
@parent
<script type="text/javascript" src="https://unpkg.com/wangeditor@4.7.15/dist/wangEditor.min.js"></script>
<script type="text/javascript">
$(function (){
	var E = window.wangEditor
	if (document.getElementById('div-demo')) {
		var editor = new E('#div-demo')

		// 配置菜单栏，设置不需要的菜单
		editor.config.excludeMenus = [
			'italic',
			'underline',
			'strikeThrough',
			'indent',
			'emoticon',
			'video'
		]

		editor.config.uploadImgShowBase64 = true
		editor.config.height = 200

		const $text1 = $('#text1')
		editor.config.onchange = function (html) {
			// 第二步，监控变化，同步更新到 textarea
			$text1.val(html)
		}
		editor.create()
		// 第一步，初始化 textarea 的值
		$text1.val(editor.txt.html())
	}
});
</script>
@endsection







